<template>
   <!--  <div>
        <mu-button class="" color="success"> primary </mu-button>
        <mu-icon value="check_circle" right></mu-icon>

    </div> -->
    <mu-container>
  <mu-bottom-nav>
    <mu-bottom-nav-item title="Recents" icon="restore"></mu-bottom-nav-item>
    <mu-bottom-nav-item title="Favorites" icon="favorite"></mu-bottom-nav-item>
    <mu-bottom-nav-item title="Nearby" icon="location_on"></mu-bottom-nav-item>
  </mu-bottom-nav>
</mu-container>
</template>
<script>
    export default {
        data () {
            return { 
                // msg: "我是page2组件"
            }
        }
    }
</script>


<style>
.icon-container {
  display: flex;
  width: 300px;
  justify-content: space-around;
}
.icon-container .mu-icon {
  margin-bottom: 12px;
}
</style>